/* app/containers/App.js */
import React from 'react';
import { connect } from 'react-redux';
import * as ListsAction from '../actions/mylist';
import { bindActionCreators } from 'redux';

import UserCollect from '../components/detail_module/user_collect';
import GroupList from '../components/GroupList';
import Toast from '../components/toast';

import YmtApiMixin from '../mixins/YmtApiMixin';
import toastMixin from '../mixins/toastMixin';


import YmtApi from 'YmtApi';

const { UserId , AccessToken } = YmtApi.utils.getAuthInfo();

const hasLogin = YmtApi.utils.hasLogin();

let List = React.createClass({
	mixins:[ YmtApiMixin,toastMixin ],
	getInitialState(){
		return {
			toastShow:false,
			tuanMap:{}
		}
	},
	getMyGroupTuanListByTopicId(topicId){
		const { actions } = this.props;
		actions.getMyGroupTuanListByTopicId({ 
			UserId , 
			AccessToken,
			topicId,
			PageSize:30
		 },((result)=>{
		 	let tuanMap = this.state.tuanMap;
		 	tuanMap[topicId] = result.Data.TuanList;
		 	console.log(tuanMap[topicId],result.Data.TuanList)
		 	this.setState({
		 		tuanMap
		 	});
		 }).bind(this),((data)=>{
			this.showToast(data.Msg)
		}).bind(this));
	},
	componentDidMount(){
		let that = this;

		const { actions } = this.props;

		YmtApi.isWechat && YmtApi.initWechat({
	           shareConf:{
	               title:'洋码头砍价团',
	               desc:'洋码头砍价团，洋码头终极折扣，洋货1折起！',
	               imgUrl:'http://p5.img.ymatou.com/upload/product/original/20020160128063011_o.jpg',
	               link:location.href.replace(/[&,\?](AccessToken|unionId|openId|wxToken)=[^&#]*/ig, '')
	           }
	       });
		

		actions.getMyTopicList({ UserId , AccessToken },((result)=>{
			console.log(result,'result');
			const { Data = {} } = result,
				  { TopicList =[] } = Data;
			TopicList.map((item)=>{
				this.getMyGroupTuanListByTopicId(item.TopicId);
			});
		}).bind(this),((data)=>{
			this.showToast(data.Msg)
		}).bind(this));
		
	},
	
	render (){ 
		const { myGroupList = {},myTopicList = {} } = this.props;

		const { data = {} } = myGroupList;
		let userCollect = {
			state:myGroupList.state,
			data:{
				TopicDto:{
					JoinGroupCount:data.JoinGroupCount,
					OpenGroupCount:data.OpenGroupCount
				}
			}
		}

		let currentGroupList = {
			state:myGroupList.state,
			data:{
				TuanList:data.TuanList
			}
		}
		let TopicListHtml;
		if(myTopicList.state === 2){
			const { data = {}} = myTopicList,
				{ TopicList = []} = data;

			TopicListHtml = TopicList.map((item,inx)=>{
				if(item.IsCurrent){
					return null;
				}
				let _data = {
					state:this.state.tuanMap[item.TopicId]?2:1,
					data:{
						TuanList:this.state.tuanMap[item.TopicId]
					}
				}

				return (
					<div key={inx}>
						<header className="group-title">
							<h4>
								<span>{item.TopicName} ^</span>
							</h4>
						</header>
						<GroupList phase="" groupList={ _data } isMyself={true}/>
					</div>
				)
			});
		}

		return (
			<div>
				<UserCollect userCollect={ userCollect } isMySelf={true} openUrl={this.openUrl} hasLogin={this.hasLogin}/>
				<div className="group-list-container">
					<header className="group-title">
						<h4>
							<span>本期砍价团</span>
						</h4>
					</header>
					<GroupList phase="" groupList={ currentGroupList } isMyself={true}/>
					{ TopicListHtml }
					<footer className="load-over">
						<div>
							<span>刷完了</span>
						</div>
					</footer>
				</div>
				
			</div>
		)
	}
});

export default connect(state => ({
		myGroupList:state.myGroupList,
		myTopicList:state.myTopicList
	}), dispatch => ({
	actions: bindActionCreators(ListsAction,dispatch)
}))(List);